<template>
  <div id="reselectPerformance">
    <van-nav-bar class="header"
                 fixed
                 @click-left="goback"
                 :border="false">
      <div class="left"
           slot="left">
        <van-icon name="arrow-left"
                  size="24px"
                  color="#fff" />
      </div>
      <div class="title"
           slot="title">重选表现师</div>
    </van-nav-bar>

    <div class="main">
      <div class="list">
        <div class="nodata fz4 wordsGray"
             v-show="list.length==0">没有更多了</div>
        <reselect-card v-for="(item,index) in list"
                       :form="item"
                       @insertBlackList="onClickAsyncClose(item)"
                       @updatePerformanceist="updatePerformanceist(item.userUid)"
                       :key="index"></reselect-card>
      </div>

    </div>
    <div class="closeBtn flex">
      <div class="btn bgprimary wordsWrite"
           @click="close_order">取消订单</div>
    </div>
  </div>
</template>

<script>
import reselectCard from "@/components/designer/orderCenter/reselectPerformance/card";
import { getuserUid } from "@/utils/auth";
export default {
  data() {
    return {
      list: [],
       dialogContent: "是否三天内不看他/她"
    };
  },
  components: {
    reselectCard
  },
  mounted() {
    this.$notify({
      message: "系统为您推荐以下优秀表现师",
      duration: 1500,
      background: "#282828",
      className: "notify1",
      refundmoney: 300
    });
    this.reselection();
  },
  methods: {
    goback() {
      this.$router.go(-1);
    },
    onClickAsyncClose(val) {
      let _this = this;
      function beforeClose(action, done) {
        if (action === "confirm") {
          _this.insertBlackList(val);
          done();
        } else {
          done();
        }
      }
      this.$dialog
        .confirm({
          message: this.dialogContent,
          beforeClose
        })
        .catch(() => {});
    },
    //拉黑表现师
    async insertBlackList(val) {
      try {
        const e = await HTTP(
          "app/attentionOrBlacklist/insertAttentionOrBlacklist",
          {
            type: 3,
            attentionUserUid: val.userUid,
            createBy: getuserUid()
          }
        );
        if (e.code === 200) {
          this.$toast("操作成功")
         this.reselection()
        } else {
          this.$toast("数据开小差了，请稍后再尝试");
        }
      } catch (error) {
        console.log(error);
        this.$toast("数据开小差了");
      }
    },
    //重选表现师
    async updatePerformanceist(userUid) {
      let orderUid = this.$route.params.uid;
      // console.log(userUid)
      const e = await HTTP("updatePerformanceist", {
        orderUid,
        userUid,
        updateBy: getuserUid()
      });

      if (e.code == 200) {
        this.$toast("选择成功！");
        this.$router.push("/designer/orderCenter");
      } else {
        this.$toast(e.msg || "服务器异常");
      }
      // console.log(e);
    },
    //重选表现师列表，正式数据全部为true,订单暂时写死
    async reselection() {
      let orderUid = this.$route.params.uid;
      const e = await HTTP("reselection", {
        orderUid,
        price: true,
        datetime: true,
        scope: true,
        label: true
      });
      if (e.code == 200) {
        this.list = e.data;
      } else {
        this.$toast(e.msg || "服务器异常");
      }
    },
    //取消订单
    close_order() {
      const _this = this;
      this.$dialog
        .confirm({
          message:
            "您确认是要订单吗？若确认退款金额将于1~3个工作日内返回您的付款账户，请您注意查收哦！"
        })
        .then(() => {
          _this.cancelOrder();
        })
        .catch(() => {});
    },
    //取消
    async cancelOrder() {
      let orderUid = this.$route.params.uid;
      const e = await HTTP("cancelOrder", {
        orderUid,
        updateBy: getuserUid()
      });
      if (e.code == 200) {
        this.$toast("取消订单成功");
        this.$router.push("/designer/orderCenter");
      } else {
        this.$toast(e.msg || "服务器异常");
      }
    }
  },
  beforeRouteLeave(to, from, next) {
    // ...
    this.$notify.clear();
    next();
  }
};
</script>
<style  lang="scss">
.notify1 {
  position: absolute;
  top: 46px;
  opacity: 0.5;
}
</style>
<style lang="scss" scoped>
#reselectPerformance {
  .header {
    height: 0.92rem;
    background: $color-primary;
    z-index: 200;
    .title {
      color: #ffffff;
    }
  }

  .main {
    margin-top: 0.92rem;
    padding-top: 0.24rem;
    margin-bottom: 1.8rem;
    .nodata {
      text-align: center;
    }
  }
  .closeBtn {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 1.6rem;
    align-items: center;
    background: #f9f9f9;
    border-top: 1px solid #e5e5e5;
    z-index: 1000;
    .btn {
      margin: auto;
      text-align: center;
      width: 94%;
      height: 0.88rem;
      line-height: 0.88rem;
      border-radius: 0.1rem;
    }
  }
}
</style>
